<template>
  <div class="mod-menu">
    <el-form :inline="true" :model="params">
      <el-form-item label="商品名称">
        <el-input v-model="params.title" placeholder="输入商品名称" clearable></el-input>
      </el-form-item>
      <!-- <el-form-item label="是否是积分商品">
				<el-select v-model="params.point_goods" @change="selectChange('point_goods')" placeholder="是否是积分商品" clearable>
					<el-option label="是" :value="1"></el-option>
					<el-option label="否" :value="0"></el-option>
				</el-select>
			</el-form-item> -->
      <el-form-item label="上架状态">
        <el-select v-model="params.added" @change="selectChange('added')" placeholder="上架状态" clearable>
          <el-option label="上架" :value="1"></el-option>
          <el-option label="下架" :value="0"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button @click="search()">查询</el-button>
        <el-button type="primary" @click="addOrUpdateHandle()">发布商品</el-button>
      </el-form-item>
    </el-form>
    <el-table :data="dataList" v-loading="tableLoading" row-key="Id" border style="width: 100%; ">
      <el-table-column prop="title" align="center" label="商品名称">
      </el-table-column>
      <el-table-column prop="price" align="center" label="价格">
        <template slot-scope="scope">
          <span>{{scope.row.min_sale_price==scope.row.max_sale_price?scope.row.min_sale_price:scope.row.min_sale_price+'~'+scope.row.max_sale_price}}</span>
        </template>
      </el-table-column>
      <el-table-column prop="real_sale_num" align="center" label="实际销量">
      </el-table-column>
      <el-table-column prop="sort" align="center" label="排序">
      </el-table-column>
      <el-table-column prop="verify_status" align="center" :formatter="statusFormatter" label="审核状态">
        <template slot-scope="scope">
          <el-tag type="success" v-if="scope.row.verify_status==1">通过</el-tag>
          <el-tag type="warning" v-if="scope.row.verify_status==0">待审核</el-tag>
          <el-tag type="danger" v-if="scope.row.verify_status==2">不通过</el-tag>
        </template>
      </el-table-column>
      <!-- <el-table-column prop="open_user_discount" align="center" label="是否开启会员折扣">
				<template slot-scope="scope">
					<el-switch v-model="scope.row.open_user_discount" :active-value="true" :inactive-value="false"
					 active-color="#17B3A3" inactive-color="#B9B9B9" @change="switchChangeDis(scope.row)" />
				</template>
			</el-table-column> -->
      <el-table-column prop="added" align="center" label="上下架">
        <template slot-scope="scope">
          <el-switch v-model="scope.row.added" :active-value="true" :inactive-value="false" active-color="#17B3A3" inactive-color="#B9B9B9" @change="switchChange(scope.row)" />
        </template>
      </el-table-column>
      <el-table-column prop="create_time" align="center" label="创建时间"></el-table-column>
      <el-table-column fixed="right" header-align="center" align="center" label="操作" width="233">
        <template slot-scope="scope">
          <el-button type="text" size="small" class="c-update" @click="addOrUpdateHandle(scope.row.id)">修改</el-button>
          <!-- <el-button type="text" size="small" @click="goShareBenefit(scope.row.id)">分润设置</el-button>
					<el-button type="text" size="small" @click="goMemberDiscount(scope.row.id)">会员折扣</el-button> -->
          <el-button type="text" size="small" v-if="scope.row.verify_status==2" @click="lookInfos(scope.row.verify_remark)">查看理由</el-button>
          <el-button type="text" size="small" class="c-error" @click="businessDelgoods(scope.row)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" :current-page="params.page" :page-sizes="[10, 20, 50, 100]" :page-size="params.limit" :total="totalPage" layout="total, sizes, prev, pager, next, jumper"></el-pagination>
    <!-- 弹窗, 新增 / 修改 -->
    <pd-add-update v-if="addOrUpdateVisible" ref="pdAddUpdate"></pd-add-update>
    <!--商品分佣设置 -->
    <pd-shareProfit v-if="setShareBenefit" @result="settingResult" ref="pdShareProfit"></pd-shareProfit>
    <!--分润设置 -->
    <member-discount v-if="ismemberDiscount" ref="memberDiscount" @result="result"></member-discount>

    <el-dialog title="审核理由" :modal-append-to-body="true" :close-on-click-modal="false" :visible.sync="visibleApply" width="30%">
      <el-form :model="dataForm" ref="dataForm" label-width="100px">
        <el-form-item label="不通过理由">
          <el-input type="textarea" disabled v-model="reason_other_txt" :rows="{min:3}" placeholder="请输入理由"></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="visibleApply = false">取消</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import pdAddUpdate from './pd-add-update.vue'
import pdShareProfit from './pd-shareProfit.vue'
import memberDiscount from './member-discount.vue'
import serviceApione from '@/api/serviceApione.js'
export default {
  data () {
    return {
      reason_other_txt: '',
      visibleApply: false,
      dataForm: {},
      dataList: [{

      }],
      params: {
        page: 1,
        limit: 10,
        added: null,
        point_goods: 1
      },
      tableLoading: false,
      totalPage: 0,
      dataListLoading: false,
      addOrUpdateVisible: false,
      setShareBenefit: false, // 分润设置
      ismemberDiscount: false // 会员折扣
    }
  },
  components: {
    pdAddUpdate,
    pdShareProfit,
    memberDiscount
  },
  mounted () {
    this.getData()
  },
  methods: {
    lookInfos (e) {
      this.reason_other_txt = e
      this.visibleApply = true
    },
    switchChange (row) {
      let msg = ''
      let param = {
        goods_id: row.id,
        added: row.added
      }
      if (row.added) {
        msg = '已上架'
      } else {
        msg = '已下架'
      }
      serviceApione.goodsPutAway(param).then(res => {
        if (res.data && res.data.code == 200) {
          this.$message.success(msg)
        } else {
          row.added = !row.added
        }
      })
    },

    switchChangeDis (row) {
      let msg = ''
      let param = {
        goods_id: row.id,
        open_user_discount: row.open_user_discount
      }
      if (row.open_user_discount) {
        msg = '已开启'
      } else {
        msg = '已关闭'
      }
      serviceApione.openDiscount(param).then(res => {
        if (res.data && res.data.code == 200) {
          this.$message.success(msg)
        } else {
          row.open_user_discount = !row.open_user_discount
        }
      })
    },

    // 每页数
    sizeChangeHandle (val) {
      this.params.page = 1
      this.params.limit = val
      this.getData()
    },
    // 当前页
    currentChangeHandle (val) {
      this.params.page = val
      this.getData()
    },

    /**
     * 删除
     * */
    businessDelgoods (row) {
      this.$confirm(`是否删除商品 [ ${row.title} ] ?`, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        serviceApione.businessDelgoods(row.id).then(res => {
          console.log(res)
          if (res.data && res.data.code == 200) {
            this.$message.success('删除成功！')
            this.getData()
          }
        })
      }).catch(() => { })
    },

    selectChange (key) {
      if (this.params[key] !== 0 && !this.params[key]) {
        this.params[key] = null
      }
    },

    search () {
      this.params.page = 1
      this.getData()
    },

    getData () {
      this.tableLoading = true
      serviceApione.getGoodsList(this.params).then(res => {
        if (res && res.data.code == 200) {
          this.dataList = res.data.page.list
          this.totalPage = res.data.page.totalCount
        }
        this.tableLoading = false
      })
    },
    // 审核动态
    statusFormatter (row, column) {
      let status = row.auditStatus
      if (status === 0) {
        return '审核不通过'
      } else {
        return '审核通过'
      }
    },
    // 新增 / 修改
    addOrUpdateHandle (id) {
      this.$router.push({
        path: '/integralGoodsadd-or-update',
        query: {
          id: id
        }
      })
      // this.addOrUpdateVisible = true
      // this.$nextTick(() => {
      //   this.$refs.pdAddUpdate.init(id)
      // })
    },
    // 分润设置
    goShareBenefit (id) {
      this.setShareBenefit = true
      this.$nextTick(() => {
        this.$refs.pdShareProfit.init(id)
      })
    },
    // 会员折扣
    goMemberDiscount (id) {
      this.ismemberDiscount = true
      this.$nextTick(() => {
        this.$refs.memberDiscount.init(id)
      })
    },

    result (e) {
      this.ismemberDiscount = false
    },
    settingResult (e) {
      this.getData()
      this.setShareBenefit = false
    }
  }
}
</script>
